<template>
  <div class="wrapper fon_14 mar_t20">
    <div class="orderlist">
      <div class="ordercard" v-for="(item,index) in list" :key="index" :class="{ 'tuikuanColor': item.refundType<='4' && item.state=='10' || item.state=='8' || item.state=='7'}">
        <div class="cardheader flex">
          <div class="daysn" :class="{ 'tuikuanColor': item.refundType<='4' && item.state=='10' || item.state=='8' || item.state=='7'}">
            <span>
              <span class="fon_14 fnormal">#</span>
              {{item.takeNo}}
            </span>
          </div>
          <div class="flex-1 pad_10">
            <div class="headertext fon_14 flex-bet">
              <div>
                <span v-if="item.deliveryMode!='10'">
                  <span class="hdfu mar_r10" v-show="item.payMode=='10'">货到付款</span>
                  <span class="yu" v-show="item.appointment=='1'">外卖 - 预</span>
                  <span class="wei mar_r5" v-show="item.appointment!='1'">立即送出</span>
                  {{item.serviceAt}}
                  <span class="mar_l5">
                    前送达
                    <span class="mar_l10 color_9">({{item.createdAt}}下单)</span>
                    <span class="mar_l10 color_9">
                      <span v-show="item.payMode=='1'">微信支付</span>
                      <span v-show="item.payMode=='5'">余额支付</span>
<!--                      <span v-show="item.payMode=='10'">货到付款</span>-->
                    </span>
                    <span class="mar_l10 color_9">
                      <span v-show="item.origin=='1'">微信小程序下单</span>
                      <span v-show="item.origin=='3'">支付宝小程序下单</span>
                      <span v-show="item.origin=='7'">头条小程序下单</span>
                    </span>
                    <span class="mar_l10 color_9" v-show="item.replaceUserId && +item.replaceUserId>0">好友代付</span>
                  </span>
                </span>
                <span v-else>
                  <span class="hdfu mar_r10" v-show="item.payMode=='10'">货到付款</span>
                  <span class="yu ziquyu" :class="{ 'tuikuanColor': item.refundType<='4' && item.state=='10' || item.state=='8' || item.state=='7'}" v-show="item.appointment=='1'">自提 - 预</span>
                  <span class="ziti ziqubor" :class="{ 'tuikuanColor': item.refundType<='4' && item.state=='10' || item.state=='8' || item.state=='7'}" v-show="item.appointment!='1'">自提</span>
                  预计到店时间：{{item.serviceAt}}
                  <span class="mar_l10 color_9">({{item.createdAt}}下单)</span>
                  <span class="mar_l10 color_9">
                    <span v-show="item.payMode=='1'">微信支付</span>
                    <span v-show="item.payMode=='5'">余额支付</span>
                  </span>
                  <span class="mar_l10 color_9">微信小程序下单</span>
                   <span class="mar_l10 color_9" v-show="item.replaceUserId && +item.replaceUserId>0">好友代付</span>
                </span>
              </div>
              <div class="pad_r_10 fon_16 wei color_6">
                <span v-if="item.state=='1'">未付款</span>
                <span v-else-if="item.state=='2'">已付款</span>
                <span v-else-if="item.state=='3'">已接单</span>
                <span v-else-if="item.state=='4' && item.deliveryMode!='10'">配送中</span>
                <span v-else-if="item.state=='4' && item.deliveryMode=='10'">自提待取</span>
                <span v-else-if="item.state=='5'">订单已完成</span>
                <span v-else-if="item.state=='6'">已评价</span>
                <span v-else-if="item.state=='7'">已取消</span>
                <span v-else-if="item.state=='8'">已拒单</span>
                <span v-else-if="item.state=='9'">申请退款</span>
                <span v-else-if="item.state=='10'">已退款</span>
                <span v-else-if="item.state=='11'">退款拒绝</span>
              </div>
            </div>
          </div>
        </div>
        <div class="pad_10 judan" v-show="item.refundType=='1' && item.state=='8' || item.state=='10' || item.state=='7'">
          <div v-show="item.refundType=='1' && item.state=='8'">商家拒单（原因：无）</div>
          <div v-show="item.refundType=='2' && item.state=='9'">用户申请退款（原因：无）</div>
          <div v-show="item.refundType=='3' && item.state=='7'">用户取消订单（原因：无）</div>
          <div v-show="item.refundType=='4' && item.state=='10'">商家未接单自动退款（原因：无）</div>
        </div>
        <div class="mar_lr20 pad_tb_20 borderbottome7 flex flex-y-top" :class="{ 'tuikuanColor': item.refundType<='4' && item.state=='10' || item.state=='8' || item.state=='7'}">
          <div class="containertitle">
            <img class="wid ordericon mar_t5" src="@/assets/img/order/user.svg" />
          </div>
          <div class="flex-bet wid">
            <div class="flex-g-1">
              <div class="flex">
                <div class="mar_r10 font_w700 lh1">{{item.receivedName}}</div>
                <span href="#" class="spanlink mar_r10 subjectcolor2" :class="{ 'tuikuanColor': item.refundType<='4' && item.state=='10' || item.state=='8' || item.state=='7'}">{{item.receivedTel}}</span>
                <!--                                <span class="color_8 mar_r10">超级会员</span>-->
                <span class="color_8">近180天第{{item.payNum}}次下单</span>
              </div>
              <div class="flex-bet wid mar_l10 mar_t5" v-if="item.deliveryMode==10">
                <div class="flex-g-1">
                  自提方式：
                  <span class="color_2 font_w700" v-if="item.isOut =='1'">店内就餐</span>
                  <span class="color_2 font_w700" v-if="item.isOut =='2'">打包带走</span>
                </div>
              </div>
              <div class="flex mar_t10" v-show="item.deliveryMode!=10">
                <div>{{item.receivedAddress}}</div>
                <a href="#" class="spanlink mar_l10" @click="openMap(item.lat,item.lng,item.receivedAddress)">查看地图</a>
              </div>
            </div>
          </div>
        </div>
        <!--                <div class="borderbottome7 mar_lr20 pad_tb_20 flex" v-if="item.state>=3 && item.state<4">-->
        <!--                    <div class="containertitle">-->
        <!--                        <img class="wid ordericon mar_t5" src="@/assets/img/order/beican.png"/>-->
        <!--                    </div>-->
        <!--                    <div class="flex-bet wid">-->
        <!--                        <div class="flex-g-1">-->
        <!--                            备餐用时 <span ref="startTimer">1</span>-->
        <!--                        </div>-->
        <!--                        <div class="flex-g-0 spanlink">-->
        <!--                            <el-button type="primary" round class="qrcc" @click="orderListQrch(item)">确认出餐</el-button>-->
        <!--                        </div>-->
        <!--                    </div>-->
        <!--                </div>-->
        <div class="borderbottome7 mar_lr20 pad_tb_20 flex" v-if="item.state>=3">
          <div class="containertitle">
            <img class="wid ordericon mar_t5" src="@/assets/img/order/peisong.svg" />
          </div>
          <div class="flex-bet wid" v-if="item.state==3 && item.deliveryMode!=10">
            <div class="flex-g-1">
              <span class="color_2 font_w700">待配送</span>
            </div>
            <div class="flex-g-0 spanlink flex-center-col">
              <el-button type="primary" class="qrsc" @click="modifyOrder(item,'delivery')">确认送出</el-button>
              <el-button style="margin-left: 0px; color: #155BD4;" v-if="configInfo.alternative && configInfo.alternative.length" type="text" @click="alternative(item)">备选配送</el-button>
            </div>
          </div>
          <div class="flex-bet wid" v-if="item.state==4 && item.deliveryMode!=10">
            <div class="flex-g-1 flex-bet">
              <div class="color_2 font_w700">
                <div>配送中</div>
                <div>{{item.deliveryName}}</div>
              </div>
              <el-button type="primary" v-if="item.state==4 && item.deliveryMode==2" @click="neworder(item.id)">重新配送</el-button>
              <div v-show="item.deliveryInfo && item.deliveryInfo.riderName" class="mar_r20">
                <div>
                  骑手：
                  <span class="color_9">{{item.deliveryInfo.riderName}}</span>
                </div>
                <div>
                  手机号：
                  <span class="color_9">{{item.deliveryInfo.riderTel}}</span>
                </div>
                <div>
                  状态：
                  <span class="color_9">{{item.deliveryInfo.stateMsg}}</span>
                </div>
                <!-- <span v-if="item.deliveryMode=='1'">商户</span>
                <span v-else-if="item.deliveryMode=='2'">达达</span>
                <span v-else-if="item.deliveryMode=='3'">点我达</span>
                <span v-else-if="item.deliveryMode=='4'">码科</span>
                <span v-else-if="item.deliveryMode=='5'">顺丰</span>
                <span v-else-if="item.deliveryMode=='6'">蜂鸟</span>
                <span v-else-if="item.deliveryMode=='7'">闪送</span>
                <span v-else-if="item.deliveryMode=='10'">自提</span>-->
              </div>
            </div>
          </div>
          <div class="flex-bet wid" v-if="item.state==5 && item.deliveryMode!=10">
            <div class="flex-g-1">
              <span class="color_2 font_w700">已完成</span>
            </div>
          </div>
          <div class="flex-bet wid" v-if="item.deliveryMode==10">
            <div class="flex-g-1">
              <span class="color_2 font_w700">自提码：{{item.selfCode}}</span>
            </div>
          </div>
        </div>
        <div class="borderbottome7 mar_lr20 pad_tb_20 flex flex-y-top">
          <div class="containertitle">
            <img class="wid ordericon mar_t5" src="@/assets/img/order/zhedie.svg" />
          </div>
          <div class="flex wid">
            <div class="flex-g-1">
              <el-collapse accordion v-model="activeNames">
                <el-collapse-item :name="index">
                  <template slot="title">
                    <div class="flex-bet wid">
                      <div><span class="color_2 font_w700">{{item.num}}件商品</span></div>
                      <div class="subjectcolor2">展开</div>
                    </div>
                  </template>
                  <div class="collapsemain">
                    <div class="flex mar_b10">
                      <div class="color-orange">备注：</div>
                      <div class="mar_l5" v-if="item.userNote">{{item.userNote}}</div>
                      <div class="mar_l5" v-else>无</div>
                    </div>
                    <div class="flex goods" v-for="(goods,pindex) in item.goodsArr" :key="pindex">
                      <div class="flex wid bordertop7">
                        <div class="flex wid goodscon">
                          <div class="bflex-9">
                            {{goods.name}}
                            <span v-show="goods.data">-{{goods.data}}</span>
                            <span v-show="goods.material">【{{goods.material}}】</span>
                            <span v-show="goods.attribute">【{{goods.attribute}}】</span>
                          </div>
                          <div class="bflex-1 color_5">X{{goods.num}}</div>
                          <div class="bflex-1 color_5 t_r">{{goods.money}}</div>
                        </div>
                      </div>
                    </div>
                    <div class="flex wid goodscon">
                      <div class="bflex-4">总计</div>
                      <div class="bflex-2 color_5"></div>
                      <div class="bflex-1 color_5 t_r">{{item.originMoney}}</div>
                    </div>
                    <div class="bordertop7 goods">
                      <div class="mar_t10 fon_12 color_8">其他</div>
                      <div class="flex wid goodscon">
                        <div class="bflex-4">包装费</div>
                        <div class="bflex-2 color_5"></div>
                        <div class="bflex-1 color_5 t_r">{{item.boxMoney}}</div>
                      </div>
                      <div class="flex wid goodscon">
                        <div class="bflex-4">配送费</div>
                        <div class="bflex-2 color_5"></div>
                        <div class="bflex-1 color_5 t_r">{{item.deliveryMoney}}</div>
                      </div>
                    </div>
                  </div>
                </el-collapse-item>
              </el-collapse>
            </div>
          </div>
        </div>
        <div class="borderbottome7 mar_lr20 pad_tb_20 flex">
          <div class="containertitle">
            <img class="wid ordericon mar_t5" src="@/assets/img/order/shifu.svg" />
          </div>
          <div class="wid">
            <div class="flex-bet">
              <div class="flex-g-1">
                <div class="color_2 rel">
                  顾客实付
                  <span class="ab tooltip">
                    <el-tooltip class="item" effect="dark" placement="top-start">
                      <div slot="content" class="tooltext">
                         <div class="flex-bet">
                          <p>商品原价：</p>
                          <p class="pad_l_30 color-green">+{{item.originMoney}}</p>
                        </div>
                        <div class="flex-bet">
                          <p>商品优惠：</p>
                          <p class="pad_l_30 color-red">-{{ item.goodsDiscount }}</p>
                        </div>
                         <div class="flex-bet">
                          <p>包装费：</p>
                          <p class="pad_l_30 color-green">+{{item.boxMoney}}</p>
                        </div>
                        <div class="flex-bet">
                          <p>配送费：</p>
                          <p class="pad_l_30 color-green">+{{item.deliveryMoney}}
                            <span class="color-red" v-if="item.deliveryPreferential>0">(已优惠：-{{item.deliveryPreferential}})</span>
                          </p>
                        </div>
                         <div class="flex-bet">
                          <p>用户实付：</p>
                          <p class="wei">{{item.money}}</p>
                        </div>
<!--                        <div class="flex-bet">-->
<!--                          <p>新客立减：</p>-->
<!--                          <p class="pad_l_30">{{item.newMoney}}</p>-->
<!--                        </div>-->
<!--                        <div class="flex-bet">-->
<!--                          <p>门店满减：</p>-->
<!--                          <p>{{item.preferentialMoney}}</p>-->
<!--                        </div>-->
<!--                        <div class="flex-bet">-->
<!--                          <p>门店优惠券：</p>-->
<!--                          <p>{{item.couponPreferential}}</p>-->
<!--                        </div>-->
<!--                        <div class="flex-bet">-->
<!--                          <p>平台优惠券：</p>-->
<!--                          <p>{{item.platformCouponPreferential}}</p>-->
<!--                        </div>-->
<!--                        <div class="flex-bet">-->
<!--                          <p>配送费优惠：</p>-->
<!--                          <p>{{item.deliveryPreferential}}</p>-->
<!--                        </div>-->
                      </div>
                      <button type="button" class="el-button question-button-tooltip el-tooltip item el-button--text fon_14 ab" style="right: -40px;top: -5px;">
                        <span>
                          <i class="el-icon-question"></i>
                        </span>
                      </button>
                    </el-tooltip>
                  </span>
                </div>
              </div>
              <div class="flex-g-0 color_5 flex">
                <div class="mar_r10" v-if="item.state<5 && item.payMode=='10'">待支付</div>
                <div class="mar_r10" v-else>已支付</div>
                <div class="font_w700">¥ {{item.money}}</div>
              </div>
            </div>
            <div class="flex-bet mar_t10">
              <div class="flex-g-1">
                <div class="color_2 rel">
                  本单预计收入
                  <span class="ab tooltip">
                    <el-tooltip class="item" effect="dark" placement="top-start">
                      <div slot="content" class="tooltext">
                        <div class="flex-bet">
                          <p>用户实付：</p>
                          <p class="pad_l_30 color-green">+{{item.money}}</p>
                        </div>
                        <div class="flex-bet">
                          <p>平台补贴：</p>
                          <p class="color-green">+{{ item.subsidy }}</p>
                        </div>
                        <div class="flex-bet">
                          <p>平台服务费：</p>
                          <p class="color-red">-{{ item.serviceMoney }}</p>
                        </div>
                        <!-- <div class="flex-bet">
                          <p>满减优惠：</p>
                          <p>-0.00</p>
                        </div>
                        <div class="flex-bet">
                          <p>优惠券优惠：</p>
                          <p>-0.00</p>
                        </div>
                        <div class="flex-bet">
                          <p>新客立减：</p>
                          <p>-0.00</p>
                        </div>
                        <div class="flex-bet">
                          <p>减免配送费：</p>
                          <p>-0.00</p>
                        </div>
                        <div class="flex-bet">
                          <p>平台服务费：</p>
                          <p>-0.00</p>
                        </div>-->
                        <div class="flex-bet">
                          <p>预计收入：</p>
                          <p class="color-green">{{item.storeActualMoney}}</p>
                        </div>
                      </div>
                      <button type="button" class="el-button question-button-tooltip el-tooltip item el-button--text fon_14 ab" style="right: -40px;top: -5px;">
                        <span>
                          <i class="el-icon-question"></i>
                        </span>
                      </button>
                    </el-tooltip>
                  </span>
                </div>
              </div>
              <div class="flex-g-0 color_5 flex">
                <div class="font_w700 color-red" :class="{ 'tuikuanColor': item.refundType<='4' && item.state=='10' || item.state=='8' || item.state=='7'}">¥ {{item.storeActualMoney}}</div>
              </div>
            </div>
          </div>
        </div>
        <div class="borderbottome7 mar_lr20 pad_tb_20 flex">
          <div class="containertitle"></div>
          <div class="flex-bet wid">
            <div class="flex-g-1">
              <div class="color_8 fon_12">下单时间: {{item.createdAt}}</div>
              <div class="color_8 fon_12">订单号: {{item.outTradeNo}}</div>
            </div>
            <div class="flex-g-0 spanlink flex">
              <div v-show="item.state==2">
                <el-button plain class="qrsc" @click="modifyOrder(item,'rejection')">拒单</el-button>
                <el-button class="qrsc" style="width: 150px;" type="primary" @click="modifyOrder(item,'receipt')">接单</el-button>
              </div>
              <div v-show="item.state>3 && item.state<4">
                <el-button plain class="qrsc">取消订单</el-button>
              </div>
              <div v-show="item.state>2">
                <el-button v-if="active === '3'" type="danger" size="medium " @click="confirmReminder(item.id)">确认催单</el-button>
                <el-button plain class="qrsc" @click="modifyOrder(item,'print')">打印订单</el-button>
              </div>
              <div v-show="item.state==4 && item.deliveryMode==10" class="mar_l20">
                <el-button @click="modifyOrder(item,'task')" class="elButtonFocus">自取提醒</el-button>
              </div>
              <div v-show="item.state==4 && item.deliveryMode!=10 && item.payMode!=10" class="mar_l20">
                <el-button type="primary" @click="modifyOrder(item,'confirm')" class="elButtonFocus qrsh">确认收货</el-button>
              </div>
              <div v-show="item.state==4 && item.deliveryMode==10 && item.payMode!=10" class="mar_l20">
                <el-button type="primary" @click="modifyOrder(item,'confirm')" class="elButtonFocus qrsh">确认收货</el-button>
              </div>
              <div v-show="item.state==4 && item.payMode==10" class="mar_l20">
                <el-button type="primary" @click="modifyOrder(item,'confirm')" class="elButtonFocus qrsh">确认收款并收货</el-button>
              </div>
              <div v-show="item.payMode!='10' && (item.state==3 || item.state==4)" class="mar_l20">
                <el-button @click="modifyOrder(item,'refund')">退款</el-button>
              </div>
              <div v-show="item.state>2" class="mar_l20">
                <el-button plain class="qrsc" @click="seeDetail(item)">查看详情</el-button>
              </div>
              <div v-show="item.state==9" class="mar_l20">
                <el-button type="danger" class="qrsc" @click="modifyOrder(item,'adoptRefund')">同意退款</el-button>
                <el-button type="primary" class="qrsc" @click="modifyOrder(item,'refuseRefund')">拒绝退款</el-button>
              </div>
            </div>
          </div>
        </div>
      </div>
      <selectmap-dialog ref="selectmapDialog" :mapLng="form.lng" :mapLat="form.lat" :mapAddress="form.address"></selectmap-dialog>
      <order-list-alt ref="orderListAlt" :configInfo="configInfo" v-if="dialogVisible" @close="dialogVisible = false" @confirm="closeB"></order-list-alt>

      <div style="height: 0; overflow: hidden">
        <ElementPrint :data="printData" ref="print" />
      </div>

      <el-dialog
          title="订单详情"
          :visible.sync="dialogVisibleDetail"
          width="48%"
      >
        <div>
          <div class="t_c">
            <div class="fon_30 color_3 mar_b10">+{{orderDetail.storeActualMoney}}</div>
            <div class="">
              <el-tag>#{{orderDetail.takeNo}} 外卖订单-<span>{{orderDetail.appointment=='1'?'预约':'及时'}}</span>单
              </el-tag>
            </div>
          </div>
          <el-form ref="form5" :model="form5" label-width="120px">
            <el-form-item label="外卖订单">
              <div class="flex-bet pad_lr_30 bor_b_df5">
                <div>商品</div>
                <div class="pad_r_60">
                  <div class="flex-bet" v-for="item in orderDetail.goodsArr" :key="item.id">
                    <div class="mar_r60">{{item.name}}</div>
                    <div>{{item.money}}</div>
                  </div>
                </div>
              </div>
              <div class="flex-bet pad_lr_30 bor_b_df5">
                <div>商品优惠</div>
                <div class="pad_r_60">
                  <div class="flex-bet">
                    <div class="mar_r60">门店满减优惠</div>
                    <div>{{orderDetail.preferentialMoney}}</div>
                  </div>
                  <div class="flex-bet">
                    <div class="mar_r60">门店代金券优惠</div>
                    <div>{{orderDetail.couponPreferential}}</div>
                  </div>
                  <div class="flex-bet">
                    <div class="mar_r60">平台代金券优惠</div>
                    <div>{{orderDetail.platformCouponPreferential}}</div>
                  </div>
                  <div class="flex-bet">
                    <div class="mar_r60">新客立减</div>
                    <div>{{orderDetail.newMoney}}</div>
                  </div>
                </div>
              </div>
              <div class="flex-bet pad_lr_30 bor_b_df5">
                <div>商品小计</div>
                <div class="pad_r_60">{{orderDetail.originMoney}}</div>
              </div>
              <div class="flex-bet pad_lr_30 bor_b_df5">
                <div>商品服务费</div>
                <div class="pad_r_60">{{orderDetail.serviceGoodsMoney}}</div>
              </div>
              <div class="flex-bet pad_lr_30 bor_b_df5">
                <div>门店商品实得金额</div>
                <div style="color: #489620" class="pad_r_60">{{orderDetail.storeGoodsMoney}}</div>
              </div>
              <div class="flex-bet pad_lr_30 bor_b_df5">
                <div>包装费</div>
                <div class="pad_r_60">
                  <div class="flex-bet">
                    <div class="mar_r60">用户支付包装费</div>
                    <div>{{orderDetail.boxMoney}}</div>
                  </div>
                  <div class="flex-bet">
                    <div class="mar_r60">平台抽佣包装费</div>
                    <div>{{orderDetail.serviceBoxMoney}}</div>
                  </div>
                </div>
              </div>
              <div class="flex-bet pad_lr_30 bor_b_df5">
                <div>门店实得包装费</div>
                <div style="color: #489620" class="pad_r_60">{{orderDetail.storeBoxMoney}}</div>
              </div>
              <div class="flex-bet pad_lr_30 bor_b_df5">
                <div>配送费</div>
                <div class="pad_r_60">
                  <div class="flex-bet">
                    <div class="mar_r60">用户支付配送费</div>
                    <div>{{orderDetail.deliveryMoney}}</div>
                  </div>
                  <div class="flex-bet">
                    <div class="mar_r60">平台抽佣配送费</div>
                    <div>{{orderDetail.serviceDeliveryMoney}}</div>
                  </div>
                </div>
              </div>
              <div class="flex-bet pad_lr_30 bor_b_df5">
                <div>门店实得配送费</div>
                <div class="pad_r_60">{{orderDetail.storeDeliveryMoney}}</div>
              </div>
              <!--              <div class="flex-bet pad_lr_30 bor_b_df5">-->

              <!--                <div >其它</div>-->
              <!--                <div style="color: #489620" class="pad_r_60">0.02</div>-->
              <!--              </div>-->
              <div class="flex-bet pad_lr_30 bor_b_df5">
                <div>门店实得总金额</div>
                <div style="color: #489620" class="pad_r_60">{{orderDetail.storeActualMoney}}</div>
              </div>
            </el-form-item>
            <el-form-item label="订单信息">
              <div class="flex-bet pad_lr_30 bor_b_df5">
                <div>订单号</div>
                <div class="pad_r_60">{{orderDetail.outTradeNo}}</div>
              </div>
              <div class="flex-bet pad_lr_30 bor_b_df5">
                <div>订单类型</div>
                <div class="pad_r_60">外卖</div>
              </div>
              <div class="flex-bet pad_lr_30 bor_b_df5">
                <div>订单下单时间</div>
                <div class="pad_r_60">{{orderDetail.createdAt}}</div>
              </div>
              <div class="flex-bet pad_lr_30 bor_b_df5">
                <div>订单完成时间</div>
                <div class="pad_r_60">{{orderDetail.completeAt}}</div>
              </div>
              <div class="flex-bet pad_lr_30 bor_b_df5">
                <div>订单结算时间</div>
                <div class="pad_r_60">{{orderDetail.entryAt}}</div>
              </div>
              <div class="flex-bet pad_lr_30 bor_b_df5">
                <div>用户信息</div>
                <div class="pad_r_60">{{orderDetail.receivedName}} {{orderDetail.receivedTel}}
                  地址:{{orderDetail. receivedAddress}}
                </div>
              </div>
              <div class="flex-bet pad_lr_30 bor_b_df5">
                <div>订单来源</div>
                <div class="pad_r_60" v-if="orderDetail.origin=='1'">微信小程序</div>
                <div class="pad_r_60" v-if="orderDetail.origin=='2'">微信公众号</div>
                <div class="pad_r_60" v-if="orderDetail.origin=='3'">支付宝</div>
                <div class="pad_r_60" v-if="orderDetail.origin=='4'">百度</div>
                <div class="pad_r_60" v-if="orderDetail.origin=='5'">H5</div>
                <div class="pad_r_60" v-if="orderDetail.origin=='6'">PC</div>
                <div class="pad_r_60" v-if="orderDetail.origin=='7'">头条</div>
              </div>
              <div class="flex-bet pad_lr_30 bor_b_df5">
                <div>配送方式</div>
                <div class="pad_r_60" v-if="orderDetail.deliveryMode=='1'">商户</div>
                <div class="pad_r_60" v-if="orderDetail.deliveryMode=='2'">达达</div>
                <div class="pad_r_60" v-if="orderDetail.deliveryMode=='3'">点我达</div>
                <div class="pad_r_60" v-if="orderDetail.deliveryMode=='4'">码科配送</div>
                <div class="pad_r_60" v-if="orderDetail.deliveryMode=='5'">顺丰</div>
                <div class="pad_r_60" v-if="orderDetail.deliveryMode=='6'">蜂鸟</div>
                <div class="pad_r_60" v-if="orderDetail.deliveryMode=='7'">闪送</div>
                <div class="pad_r_60" v-if="orderDetail.deliveryMode=='10'">自提</div>
              </div>
            </el-form-item>
          </el-form>
        </div>
        <!--        <span slot="footer" class="dialog-footer">-->
        <!--    <el-button @click="dialogVisibleDetail = false">取 消</el-button>-->
        <!--    <el-button type="primary" @click="dialogVisibleDetail = false">确 定</el-button>-->
        <!--  </span>-->
      </el-dialog>
    </div>
  </div>
</template>

<script>
import selectmapDialog from '@/plugins/selectmapDialog';
import orderListAlt from './orderList-alt';
import {modifyOrder, newOrder, orderContent,confirmReminder} from '@/api/order';
import { getStoreConfig } from '@/api/setup';
import { mapMutations } from 'vuex';

import ElementPrint from "@/views/order/components/elementPrint";
import {billOrderDetail} from "@/api/statistics";
export default {
  props: {
    list: {
      type: Array
    },
    active: {
      type: String,
      default: ''
    }
  },
  components: {
    ElementPrint,
    selectmapDialog,
    orderListAlt
  },
  created() {
    getStoreConfig({ ident: 'deliveryMode' }).then((res) => {
      if (res.code == 1) {
        this.configInfo = res.data;
      }
    });
  },
  name: 'orderlist',
  data() {
    return {
      printData: {},
      dialogVisible: false,
      configInfo: {},
      activeNames: '',
      form: {
        lng: 114.304692,
        lat: 30.59331,
        address: '湖北省武汉市'
      },

      timer: '',
      content: '',
      hour: 0,
      minutes: 0,
      seconds: 0,
      dialogVisibleDetail:false,
      orderDetail: {},
      form5: {},
    };
  },
  methods: {
    ...mapMutations(['updataOrderNumber']),
    alternative(id) {
      this.dialogVisible = true;
      this.$nextTick(() => {
        this.$refs.orderListAlt.init(id);
      });
    },
    closeB(id, value) {
      this.modifyOrder(id, 'delivery', value);
      this.dialogVisible = false;
    },
    // startTimer () {
    //     this.seconds += 1;
    //     if (this.seconds >= 60) {
    //         this.seconds = 0;
    //         this.minute = this.minute + 1;
    //     }
    //
    //     if (this.minute >= 60) {
    //         this.minute = 0;
    //         this.hour = this.hour + 1;
    //     }
    //     this.$refs.startTimer.innerHTML = (this.minutes < 10 ? '0' + this.minutes : this.minutes) + ':' + (this.seconds < 10 ? '0' + this.seconds : this.seconds);
    // },
    openMap(lat, lng, receivedAddress) {
      if (lat && lng && receivedAddress) {
        this.form.lat = +lat;
        this.form.lng = +lng;
        this.form.address = receivedAddress;
        this.$refs['selectmapDialog'].dialogVisible = true;
      } else {
        this.$baseMessage('请检查地址经纬度', 'warning');
      }
    },
    async confirmReminder(orderId) {
      await confirmReminder({ orderId: orderId })
      this.$emit('initMethod')
    },
    async modifyOrder(row, type, value) {
      if (type == "print") {
        const { data } = await orderContent({orderId:row.id});
          Object.keys(data).map(key=>{
            this.printData = data[key];
            this.$nextTick(() => {
              this.$refs.print.printElement(key);
            });
          })
          const { msg } = await modifyOrder({ orderId: row.id, type});
          this.updataOrderNumber(JSON.stringify(new Date()));
          this.$baseMessage(msg, 'success');
          this.$emit('initMethod');
        // this.printData = row;
        // this.$nextTick(() => {
        //   this.$refs.print.printElement();
        // });
      }
      else if (type == 'adoptRefund') {
        this.$baseConfirm('您确定同意退款此订单吗', null, async () => {
          const { msg } = await modifyOrder({ orderId: row.id, type });
          this.updataOrderNumber(JSON.stringify(new Date()));
          this.$baseMessage(msg, 'success');
          this.$emit('initMethod');
        });
      } else if (type == 'refund') {
        this.$baseConfirm('您确定退款吗', null, async () => {
          const { msg } = await modifyOrder({ orderId: row.id, type });
          this.updataOrderNumber(JSON.stringify(new Date()));
          this.$baseMessage(msg, 'success');
          this.$emit('initMethod');
        });
      } else if (type == 'refuseRefund') {
        this.$baseConfirm('您确定拒绝此用户退款申请吗', null, async () => {
          const { msg } = await modifyOrder({ orderId: row.id, type });
          this.updataOrderNumber(JSON.stringify(new Date()));
          this.$baseMessage(msg, 'success');
          this.$emit('initMethod');
        });
      } else if (type == 'rejection') {
        this.$baseConfirm('您确定拒绝此订单吗', null, async () => {
          const { msg } = await modifyOrder({ orderId: row.id, type });
          this.updataOrderNumber(JSON.stringify(new Date()));
          this.$baseMessage(msg, 'success');
          this.$emit('initMethod');
        });
      } else {
        const { msg } = await modifyOrder({ orderId: row.id, type, deliveryMode: value });
        this.updataOrderNumber(JSON.stringify(new Date()));
        this.$baseMessage(msg, 'success');
        this.$emit('initMethod');
      }
    },
    neworder(id) {
      this.$baseConfirm('订单未终结(已取消、已过期、投递异常的订单才能重发),确认重新下单吗？', null, () => {
        newOrder({ id }).then((res) => {
          console.log(res);
        });
      });
    },
    async seeDetail(item){
      this.dialogVisibleDetail = true;
      const {data} = await billOrderDetail({outTradeNo: item.outTradeNo,orderId: item.id});
      this.orderDetail = data;
      this.$emit('initMethod');
    },
    orderListQrch(param, item) {
      console.log('234', param, item);
    }
  }
};
</script>
<style lang="scss">
.el-collapse-item__header {
  height: 28px;
  line-height: 28px;
  border: none;
}

.el-collapse-item__wrap {
  border: none;
}
</style>
<style lang="scss" scoped>
/*订单详情*/
.orderlist {
  position: relative;
  /*padding-bottom: 45px;*/
  flex: 1 1 0px;
}

.ordercard {
  color: rgb(45, 47, 51);
  word-break: break-all;
  box-shadow: rgba(0, 0, 0, 0.08) 0px 2px 4px;
  background: rgb(255, 255, 255);
  margin: 0px 0px 30px;
  border-width: 1px;
  border-style: solid;
  border-color: rgb(231, 235, 245);
  border-image: initial;
  border-radius: 4px;
  animation: 0.3s ease 0s 1 normal none running cardFadeIn-data-v-1bb63870;
}

.cardheader {
  font-size: 16px;
  line-height: 60px;
  min-height: 40px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  //background: rgb(240, 243, 249);
  background: #f7f7f7;
}

.cardheader .daysn {
  margin-left: 20px;
  min-width: 41px;
  font-size: 24px;
  font-weight: 700;
  padding: 0px 10px 0px 0px;
  color: #1989fa;
}

.column {
  display: flex;
  flex-direction: column;
  flex: 0 0 auto;
}

.flex-1 {
  flex: 1 1 0px;
}

.yu {
  color: #fff;
  border-radius: 5px;
  padding: 5px 8px;
  background: #155bd4;
}
.ziquyu {
  background: #48b138;
  margin-right: 5px;
}
.ziqubor {
  border-radius: 5px;
  padding: 5px 8px;
  background: #48b138;
  color: #fff;
}
.hdfu{
  border-radius: 5px;
  padding: 5px 8px;
  background: #F56C6C;
  color: #fff;
}
/*.ziti{*/
/*    color: #FA5555;*/
/*}*/

.bordertop7 {
  border-top: 1px solid #e7ebf5;
}

.borderbottome7 {
  border-bottom: 1px solid #e7ebf5;
}

.containertitle {
  width: 50px;
}

.ordericon {
  width: 16px;
  height: 16px;
}

.qrcc,
.qrsc {
  height: 40px;
  line-height: 14px;
}

.el-collapse {
  border: none;
}

.goods .goodscon {
  padding: 8px 0;
}

.goods .goodscon:hover {
  background: #f0f3f9;
}

.tooltip {
  top: -5px;
  left: 64px;
}

.tooltext {
  line-height: 28px;
  padding: 0 6px;
}

.el-button--text {
  color: rgb(45, 47, 51);
}
.judan {
  margin: 10px;
  background: #f0f3f9;
  color: #808595;
}
.tuikuanColor {
  color: #8c93a3 !important;
}
.elButtonFocus {
  color: #409eff;
  border-color: #c6e2ff;
  background-color: #ecf5ff;
}
.qrsh {
  color: #fff;
  border-color: #48b138;
  background-color: #48b138;
}
</style>
